<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="./dist/css/zui.min.css">
    <style>
        .box{
                /* background-color: pink; */
                width: 100%;
                height: 100%;
                background-image: url('./img/上岸3.jpg'); 
                background-repeat:no-repeat;
                background-attachment:fixed;
                background-size:100% 100%; 
            }
        *{
            margin: 0;
            padding: 0;
        } 
        .buttons{
            margin: 0 auto;
        }  
        .text1{
            padding: 0;
            margin: 0;
        }
        .lead{
             width: 100%;
             height: 50px;
        }
        .ul{
            width: 100%;
            height: 100%;
            float: left;
            display: flex;
            margin: 0;
            padding: 0;
            list-style: none;
            /* border-bottom: 1px solid blue ; */
        }
        .li{
            font-size: 23px;
            font-family: cursive;
            text-decoration: none;
            margin: 2px;
        }
        
        
        </style>
        </head>
        <body class="box">
            <div calss="lead">
                <ul class="ul">
                    <strong>
                    <i class="icon icon-align-justify" style=" font-size: 23px;"></i>
                    <a href="#" class="li">导航栏</a>
                    <a href="file:///C:/Users/Lenovo/Desktop/html/program/ProjectKaoYan/2.html" class="li">送祝福</a>
                    <a href="file:///C:/Users/Lenovo/Desktop/html/program/ProjectKaoYan/写心愿.html" class="li">留心愿</a>
                    </strong>
                </ul>
            </div>
           <div class="container">
                <div>
                    <img src="./img/不甘平凡5.jpg" alt="" 
                    style="width: 100%;
                    height: 20%;">
                </div>
                <br>
                <form action="">
                    <!--  -->
                    <div class="row">
                        <div class="col-lg-10 col-md-10 col-sm-10 col-xm-10">
                             <div class="input-control has-icon-left">
                                <input id="inputAccountExample1" type="text" class="form-control" placeholder="昵称"
                                 style="background-color: #FFF8DC;
                                        font-family: cursive;
                                        font-size: 20px;">
                                <label for="inputAccountExample1" class="input-control-icon-left"><i class="icon icon-user "></i></label>
                            </div> 
                        </div>
                    </div>
                    <br>
                    <!--  -->
                    <div class="row">
                        <div class="col-lg-10 col-md-10 col-sm-10 col-xm-10">
                            <div class="input-control has-icon-left">
                                <!-- <div class="text1"> -->
                                    <textarea rows="2"  cols="2" id="inputAccountExample1" type="text" class="form-control"
                                    style="background-color: #FFF8DC;
                                    font-size: 19px;
                                    font-family: cursive;
                                    padding: 3px;">写上您的心愿
                                    </textarea>
                                    <label for="inputAccountExample1" class="input-control-icon-left"></label>
                                <!-- </div> -->
                            </div>
                      </div>
                    </div>
                    <div class="row">
                        <div class="col-lg-2 col-md-2 col-sm-2 col-xm-2">
                            <div class="buttons">
                                <button class="btn btn-primary" type="button"
                                 style="    margin-top: 7.9%;
                                 margin-left: 39%;
                                 background-color: #FFF8DC;
                                 color: darkblue;
                                 font-family: cursive;
                                 font-size: 16px;"
                                 onclick="onk()"
                               ><strong>提交</strong></button>
                            </div>
                        </div>
                    </div>
                </form>
           </div>
           <script>
            function onk(){
                confirm("祝您成功上岸")
            }
           </script>
        </body>
        </html>